// 封装 筛选权限路由的模块
import { asyncRouter, constantRoutes } from '@/router/index'

const state = {
  routes: []
}

const mutations = {
  setRoutes(state, routes) {
    state.routes = [...constantRoutes, ...routes]
  }
}

const actions = {

  filterRoutes(store, menus) {
    // * 我们需要通过动态路由数组和menus数组进行匹配筛选出具有访问权限的动态路由数据
    // * 如何匹配呢？
    // * 答：我们可以为每一个动态路由添加一个name属性，这个属性的就是我们添加的页面访问权限
    // * 对应的标识符，
    // * 我们只需要判断到动态路由中的name属性的值存在在menus数组中即可说明 该路由是具有访问
    // * 权限的路由
    console.log('filterrouter', menus)
    const routes = asyncRouter.filter(item => {
      console.log(item)
      return menus.indexOf(item.children[0].name) !== -1
    })
    console.log('筛选出来具有访问权限的动态路由', routes)
    store.commit('setRoutes', routes)
    return routes
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}

